<template>
  <a-table
    :columns="columns"
    :dataSource="dataSource"
    :scroll="scroll"
    :rowKey="rowKey"
    :pagination="pagination"
    :customRow="customRow"
    :bordered="bordered"
    :expandIcon="expandIcon"
    :expandRowByClick="expandRowByClick"
    :rowClassName="() => rowClassName"
    :expandedRowKeys="expandedRowKeys"
    :expandedRowRender="expandedRowRender"
    :expandIconColumnIndex="expandIconColumnIndex"
    :loading="loading"
    :rowSelection="rowSelection"
    :size="size"
  >
    <template v-for="(index, name) in $slots" :slot="name">
      <slot :name="name" />
    </template>

    <template
      v-for="(index, name) in $scopedSlots"
      :slot="name"
      slot-scope="slotProps"
    >
      <slot :name="name" :row="slotProps" />
    </template>
  </a-table>
</template>

<script>
export default {
  name: 'DTable',
  props: {
    size: {
      type: String,
      default: 'default'
    },
    rowSelection: {
      type: Object
    },
    loading: {
      type: Boolean,
      default: false
    },
    columns: {
      type: Array,
      required: true
    },
    expandIcon: {
      type: Function
    },
    dataSource: {
      type: Array,
      required: true
    },
    expandRowByClick: {
      type: Boolean,
      default: false
    },
    scroll: {
      type: Object
    },
    rowKey: {
      type: [String, Function]
    },
    pagination: {
      type: [Boolean, Object],
      default: false
    },
    customRow: {
      type: Function
    },
    bordered: {
      type: Boolean,
      default: false
    },
    rowClassName: {
      type: String
    },
    expandedRowKeys: {
      type: Array
    },
    expandedRowRender: {
      type: Function
    },
    expandIconColumnIndex: {
      type: Number
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep .tw-table-thead tr th {
  font-size: 12px;
  height: 50px;
}
::v-deep .tw-table-tbody > tr > td {
  background: #ffffff;
  font-size: 13px;
  line-height: 18px;
  height: 50px;
  color: #666666;
}
::v-deep .tw-table-tbody > tr > td:first-child {
  color: #444444;
}
</style>
